<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="resources/js/sun-init.js"></script>
<style type="text/css">
body{font:normal 15px/1.5 Arial, Helvetica, Free Sans, sans-serif;color: #222;background:url('resources/images/pattern.png');overflow-y:scroll;padding:60px 0 0 0;}
#my-form{width:755px;margin:0 auto;border:1px solid #ccc;padding:3em;border-radius:3px;box-shadow:0 0 2px rgba(0,0,0,.2);}
#comments{width:350px;height:100px;}
</style>
<title>后台管理系统註冊</title>
</head>
<body>
<div class="row">

  <div class="eightcol last">

    <!-- Begin Form -->

    <form id="my-form" method="post" name="register" action="register">

        <section name="第一步">

          <div><label>用户名:</label><input id="username" name="name" type="text"/></div>
          <div><label>密码:</label><input id="pass" name="password" type="password"/></div>
          <div><label>邮箱:</label><input id="email" name="email" data-ideal="required email" type="email"/></div>
          <div><label>出生日期:</label><input name="date" class="datepicker" data-ideal="date" type="text" placeholder="月/日/年"/></div>
          <div><label>上传头像:</label><input id="file" name="file" multiple type="file"/></div>
          <div><label>个人主页:</label><input name="website" data-ideal="url" type="text"/></div>
        </section>

        <section name="第二步">
          <div id="languages">
            <label>语言:</label>
            <label><input type="checkbox" name="langs[]" value="English"/>英文</label>
            <label><input type="checkbox" name="langs[]" value="Chinese"/>中文</label>
            <label><input type="checkbox" name="langs[]" value="Spanish"/>西班牙文</label>
            <label><input type="checkbox" name="langs[]" value="French"/>法文</label>
          </div>
          <div><label>精通几门:</label>
            <label><input type="radio" name="radio" checked/>1</label>
            <label><input type="radio" name="radio"/>2</label>
            <label><input type="radio" name="radio"/>3</label>
            <label><input type="radio" name="radio"/>4</label>
          </div>
        </section>

        <section name="第三步">
          <div><label>电话:</label><input type="tel" name="phone" data-ideal="phone"/></div>
          <div><label>国籍:</label>
          <select id="states" name="states">
            <option value="default">&ndash; 选择国籍 &ndash;</option>
            <option value="AL">阿拉伯</option>
            <option value="AK">中国</option>
            <option value="AZ">美国</option>
            <option value="AR">法国</option>
            <option value="CA">英国</option>
            <option value="CO">德国</option>
            <option value="CT">西班牙</option>
            <option value="DE">俄罗斯</option>
          </select>
        </div>
        <div><label>邮编:</label><input type="text" name="zip" data-ideal="zip"/></div>
        <div><label>备注:</label><textarea id="comments" name="remark"></textarea></div>
      </section>

      <div><hr/></div>

      <div>
        <button type="submit">提交</button>
        <button id="reset" type="button">重置</button>
        <button id="return" type="button" >返回</button>
      </div>

    </form>

    <!-- End Form -->

  </div>

</div>
<script type="text/javascript" src="resources/js/sun.register.js"></script>
</body>
</html>